<%--
  Created by IntelliJ IDEA.
  User: tianyu
  Date: 2023/7/2
  Time: 11:11
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css"
          integrity="sha384-HSMxcRTRxnN+Bdg0JdbxYKrThecOKuH5zCYotlSAcp1+c8xmyTe9GYg1l9a69psu" crossorigin="anonymous">

    <link rel="stylesheet" href="./css/fileinput.min.css">

    <script src="http://code.jquery.com/jquery-3.7.0.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js"
            integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd"
            crossorigin="anonymous"></script>
    <script src="./js/fileinput.min.js"></script>
    <style>
        th,td{ text-align: center}

        </style>
</head>
<style>
    /* css 标签选择器*/
    .a{
        position: absolute;/*绝对定位*/
        left: 42%;/*距离游览器左边*/
        top: 36%;/*距离游览器上边*/
        width: 243px;/* 宽度*/
        height: 173px;/* 高度*/
        border: 1px solid darkgreen;/*边框*/
        border-radius: 10px; /* 圆角*/
        background:  rgba(136,203,31,0.3);    /*a/ *背景颜色 */
        text-align: center; /*文本居中 */
    }
    .btn{
        margin-top: 8px; /*上的外边框*/
        width: 40px;
        height: 25px;
        font-size: 10px;
        background: lightpink;
        border-radius: 5px;
        text-align: center;

    }
</style>


<body style="background-image: url('./images/5.jpg')">
<!-- 导航  开始 -->
<div class="row">
    <div class="col-md-1"></div>
    <div class="col-md-10">
        <nav class="navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                    <a class="navbar-brand" href="#">商品购物管理</a>
                </div>
                <div>
                    <!--向左对齐-->
                    <ul class="nav navbar-nav navbar-left">
                        <li class="dropdown">
                            <a href="home.jsp" class="dropdown-toggle" >
                                首页
                                <b class="caret"></b>
                            </a>
                        </li>
                        <li class="dropdown">
                            <a href="shopping.jsp" class="dropdown-toggle" >商品</a>
                        </li>
                        <li class="dropdown">
                            <a href="buyerregister.jsp" class="dropdown-toggle">
                                注册
                            </a>
                        </li>
                        <li class="dropdown">
                            <a href="login.html" class="dropdown-toggle" >后台管理</a>
                        </li>
                    </ul>
                    <!--向右对齐 -->
                    <ul class="nav navbar-nav navbar-right">
                    </ul>
                </div>
            </div>
        </nav>
    </div>
    <div class="col-md-1"></div>
</div>
<!-- 导航  结束 -->

<div class="a">
    <h2>用户登录</h2><!--快捷换行 shift +回车 -->
    账号：<input type="text" name="buyername" palceholder="请输入账号"><br><!-- 复制 Ctrl+d -->
    密码：<input type="password" name="password" palceholder="请输入密码"><br>
    <input type="button" id="btn" class="btn" value="登录">
</div>
</body>
<script src="https://code.jquery.com/jquery-3.7.0.min.js"></script>
<script>
    console.log(123)
    //登录按钮
    $("#btn").on("click",function () {

        var buyername= $("input[name=buyername]").val();
        var password= $("input[name=password]").val();

        if(!buyername){
            alert("账号不能为空");
            return;
        }

        if(!password){
            alert("密码不能为空");
            return;
        }

        $.ajax
        (
            {
                url: "/Test/buyerlogin",//请求路径
                data: {buyername:buyername,password:password},//请求数据
                type: "POST",//请求方式 GET/POST/ PUT/DELETE
                //dataType: "json",//请求数据类型
                //contentType: "application/json",//返回数据类型
                success: function (data) {
                    console.log(data);
                    data = JSON.parse(data);//把后台的数据处理为json格式
                    if (data.code == "0000") {
                        alert("登录成功")
                        location.href="home2.jsp";
                    } else {
                        alert(data.msg);
                    }
                }
            }
        )
    })
</script>
</html>